<template>
  <div id="my">
    <!-- 明信片 -->
    <div class="background">
        <!-- 背景 -->
      <img src="../assets/img/bg.png" alt />
      <!-- 名片 -->
      <div class="user" v-show="login">
          <!-- 头像名字部分 -->
        <div class="Myname">
          <img src="../assets/img/wdtx.jpg" alt />
          <p>熙</p>
          <i class="iconfont icon-gt" @click="people()"></i>
        </div>
        <!-- 账户 -->
        <div class="money">
            <div class="money_one">
              <svg t="1640661623020" class="icon" viewBox="0 0 1025 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11604" width="200" height="200"><path d="M558.95 814.542c-9.551 7.974-23.847 6.723-31.87-2.787L200.83 425.009c-3.895-4.617-5.757-10.491-5.244-16.54 0.514-6.048 3.339-11.524 7.956-15.42l187.663-158.306c9.55-7.972 23.846-6.722 31.868 2.787l326.25 386.746c8.064 9.559 6.848 23.896-2.71 31.958L558.95 814.542z" fill="#FFD238" p-id="11605"></path><path d="M391.205 234.743L203.542 393.05c-4.617 3.895-7.443 9.371-7.956 15.419-0.513 6.048 1.349 11.922 5.244 16.54l0.105 0.124 192.04-160.316c8.023-6.698 19.957-5.623 26.655 2.401l325.675 390.12 1.307-1.104c9.559-8.062 10.775-22.399 2.711-31.958L423.073 237.53c-8.022-9.51-22.318-10.76-31.868-2.787" fill="#F0A600" p-id="11606"></path><path d="M386.399 228.985c12.708-10.609 31.732-8.945 42.407 3.71l326.25 386.745c10.73 12.72 9.112 31.798-3.608 42.527L563.866 820.208l-0.11 0.091c-12.708 10.61-31.732 8.946-42.407-3.709l-326.25-386.746c-10.73-12.719-9.112-31.798 3.608-42.527l187.582-158.24z m30.942 13.381c-5.367-6.36-14.948-7.194-21.33-1.865l-0.06 0.05-187.572 158.231c-6.381 5.384-7.198 15.01-1.815 21.39l326.25 386.747c5.367 6.361 14.948 7.193 21.33 1.865l0.06-0.05 187.572-158.232c6.38-5.383 7.198-15.008 1.815-21.39z m-39.13 51.37l6.48 5.906c8.874 8.087 22.595 8.412 32.627 0.775l7.568-5.763L696.944 617.16c4.326 5.128 6.395 11.65 5.825 18.363-0.57 6.713-3.708 12.793-8.835 17.12l-129.56 109.292a6.403 6.403 0 0 1-0.101 0.084c-10.613 8.861-26.457 7.486-35.381-3.094L256.832 436.42l6.957-6.49c9.218-8.6 11.209-22.18 4.733-32.29l-4.73-7.383 114.42-96.522z m0.19 26.004l-89.008 75.086c5.364 14.002 3.236 29.994-5.632 42.496L544.179 746.03c1.805 2.14 5.132 2.428 7.279 0.636l0.02-0.017 129.559-109.293c2.146-1.81 2.43-5.153 0.62-7.3L421.239 321.35c-13.818 6.635-29.94 6.037-42.837-1.609z" fill="#332D21" p-id="11607"></path><path d="M363.158 667.7c-11.164-5.491-15.825-19.063-10.392-30.255L573.74 182.27c2.638-5.434 7.25-9.52 12.985-11.508 5.736-1.986 11.887-1.627 17.322 1.01L824.912 279c11.163 5.49 15.825 19.062 10.392 30.255L614.33 764.427c-5.462 11.25-19.057 15.96-30.307 10.498L363.158 667.7z" fill="#FFD238" p-id="11608"></path><path d="M824.912 278.999L604.047 171.774c-5.435-2.638-11.586-2.997-17.322-1.01-5.735 1.987-10.347 6.073-12.985 11.507l-0.071 0.147 224.477 110.409c9.379 4.613 13.242 15.955 8.629 25.334L582.484 774.178l1.539 0.747c11.25 5.462 24.845 0.752 30.306-10.498l220.974-455.173c5.434-11.193 0.772-24.765-10.391-30.255" fill="#F0A600" p-id="11609"></path><path d="M566.993 178.997c7.268-14.97 25.359-21.238 40.329-13.97l220.77 107.18 0.13 0.061c14.855 7.307 21.058 25.367 13.828 40.261L621.076 767.702c-7.267 14.97-25.36 21.236-40.33 13.97l-220.77-107.179-0.128-0.063c-14.855-7.307-21.06-25.367-13.83-40.26z m33.778-0.476c-7.51-3.646-16.638-0.484-20.284 7.026L359.513 640.72c-3.635 7.487-0.505 16.581 6.955 20.25l0.07 0.034 220.76 107.173c7.51 3.646 16.638 0.485 20.284-7.026l220.974-455.173c3.635-7.487 0.505-16.58-6.955-20.25l-0.071-0.034z m30.29 47.18l134.664 65.375-2.767 8.32c-3.788 11.392 1.485 24.063 12.538 30.13l8.34 4.577-184.27 379.566c-2.93 6.035-8.05 10.574-14.417 12.78-6.366 2.204-13.196 1.804-19.23-1.125l-152.483-74.026-0.119-0.058c-12.406-6.102-17.582-21.139-11.537-33.59l184.27-379.567 8.754 3.721c11.603 4.933 24.821 1.238 31.43-8.783l4.827-7.32z m6.22 25.251c-10.619 10.585-26.098 15.134-41.124 12.106L419.772 626.384c-1.222 2.52-0.135 5.676 2.375 6.91l0.023 0.012 152.482 74.025c2.526 1.227 5.696 0.13 6.922-2.397L757.96 341.608c-11.674-9.934-17.674-24.909-15.922-39.8L637.28 250.951z m11.032 69.592c3.701 1.82 5.24 6.338 3.42 10.04l-41.929 85.246c-1.783 3.626-6.154 5.177-9.812 3.527l-0.228-0.107c-3.7-1.82-5.24-6.34-3.42-10.04l41.93-85.246c1.82-3.702 6.337-5.241 10.04-3.42z m24.823 34.497c3.701 1.82 5.24 6.338 3.42 10.04l-24.275 49.353c-1.783 3.626-6.155 5.176-9.812 3.527l-0.228-0.107c-3.702-1.82-5.24-6.339-3.42-10.04l24.274-49.354c1.821-3.7 6.34-5.24 10.041-3.419z" fill="#332D21" p-id="11610"></path><path d="M306.578 856.692c-69.52 0-126.078-56.56-126.078-126.079V570.578c0-69.52 56.558-126.078 126.078-126.078h378.87c69.52 0 126.078 56.558 126.078 126.078v160.035c0 69.52-56.558 126.078-126.078 126.078h-378.87z" fill="#EFEAE4" p-id="11611"></path><path d="M678.543 444.5h-23.069l53.175 34.964a111.556 111.556 0 0 1 50.265 93.211V755.53a56.909 56.909 0 0 1-32.51 51.414l-3.604 1.71a112.447 112.447 0 0 1-48.218 10.862H217.267c22.846 22.95 54.447 37.175 89.311 37.175h371.965c73.444 0 132.983-59.538 132.983-132.982V577.483c0-73.444-59.539-132.983-132.983-132.983" fill="#D8D3CE" p-id="11612"></path><path d="M817.234 713.843H572.542c-34.786 0-63.247-28.461-63.247-63.247s28.46-63.247 63.247-63.247h244.692c10.825 0 19.68 8.856 19.68 19.68v87.133c0 10.825-8.855 19.68-19.68 19.68" fill="#FFD238" p-id="11613"></path><path d="M572.542 721.343c-39.01 0-70.747-31.736-70.747-70.747 0-39.01 31.737-70.747 70.747-70.747h244.692c14.988 0 27.18 12.193 27.18 27.18v87.133c0 14.988-12.192 27.18-27.18 27.18H572.542z" fill="#FFD238" p-id="11614"></path><path d="M819.915 587.555v90.073c0 10.984-8.904 19.888-19.888 19.888H530.25c11.227 10.134 26.07 16.327 42.29 16.327h244.693c10.825 0 19.68-8.856 19.68-19.681V607.03c0-9.914-7.434-18.155-17-19.476" fill="#F0A600" p-id="11615"></path><path d="M685.448 437c35.55 0 69.057 13.931 94.353 39.226 25.041 25.042 38.945 58.134 39.221 93.286l0.004 1.066 0.001 1.816c18.11 0.927 32.596 15.812 32.883 34.082l0.005 0.555v87.13c0 18.523-14.595 33.7-32.888 34.636v1.816c0 35.549-13.932 69.058-39.226 94.353-25.043 25.042-58.134 38.945-93.287 39.22l-1.066 0.005h-378.87c-35.549 0-69.057-13.93-94.353-39.225-25.042-25.042-38.945-58.135-39.22-93.287l-0.005-1.066V570.578c0-35.549 13.93-69.057 39.225-94.352 25.043-25.042 58.135-38.946 93.287-39.222l1.066-0.004h378.87z m0 15h-378.87c-64.566 0-117.51 52.298-118.562 116.625l-0.016 1.953v160.035c0 64.566 52.298 117.51 116.625 118.562l1.953 0.016h378.87c64.566 0 117.51-52.298 118.562-116.625l0.016-1.953v-1.771H572.542c-42.714 0-77.544-34.402-78.237-76.954l-0.01-1.292c0-42.714 34.403-77.544 76.955-78.237l1.292-0.01 231.484-0.001v-1.77c0-64.566-52.298-117.51-116.625-118.562l-1.953-0.016z m118.578 135.348H572.542c-34.786 0-63.247 28.462-63.247 63.248 0 34.438 27.894 62.677 62.205 63.238l1.042 0.009 231.484-0.001V587.348z m15 0.082v126.331c9.88-0.903 17.71-9.187 17.886-19.252l0.003-0.347V607.03c0-10.222-7.896-18.688-17.888-19.6z m-212.963 25.85c20.609 0 37.316 16.708 37.316 37.316 0 20.609-16.707 37.316-37.316 37.316-20.61 0-37.315-16.707-37.315-37.316 0-20.608 16.706-37.315 37.315-37.315z" fill="#332D21" p-id="11616"></path></svg>
              <div>
                <p>账户</p>
                <p>填饱我的小金库</p>
              </div>
            </div>
            <div class="money_one">
              <svg t="1640661559376" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11460" width="200" height="200"><path d="M804.81 880.24H232.74c-45.55 0.63-65.28-46.18-60.69-82.51l525.94 14.21c77.78-2.71 77.78 4.37 72.14-54.59l-46.74-452.82c36.73 0 69.8 25.26 74.25 60.46l57.84 457.81c-10.3 33.92-29.42 48.38-50.67 57.44z" fill="#FFD524" p-id="11461"></path><path d="M792.97 884.87H230.46c-18.66 0-36.41-7.96-48.68-21.85-12.04-13.62-17.67-31.72-15.45-49.67l29.7-240.17a4.003 4.003 0 0 1 4.46-3.48c2.19 0.27 3.75 2.27 3.48 4.46l-29.7 240.17c-1.94 15.67 2.98 31.49 13.51 43.39 10.76 12.17 26.31 19.15 42.68 19.15h562.52c16.37 0 31.93-6.98 42.68-19.15 10.52-11.9 15.44-27.72 13.51-43.39l-55.5-448.86c-4.02-32.47-32.07-56.95-65.25-56.95h-433.4c-33.19 0-61.24 24.48-65.25 56.95a4.003 4.003 0 0 1-4.46 3.48 4.003 4.003 0 0 1-3.48-4.46c4.51-36.47 35.98-63.97 73.19-63.97H728.4c37.22 0 68.68 27.5 73.19 63.97l55.5 448.86c2.22 17.95-3.41 36.05-15.45 49.67-12.26 13.88-30.01 21.85-48.67 21.85z" fill="#333333" p-id="11462"></path><path d="M212.37 477.53a3.869 3.869 0 0 1-3.85-4.36l1.32-10.67c0.26-2.13 2.2-3.64 4.33-3.37 2.13 0.26 3.64 2.2 3.37 4.33l-1.32 10.67a3.89 3.89 0 0 1-3.85 3.4zM681.72 296.72c-2.21 0-4-1.79-4-4 0-86.88-74.47-157.55-166.01-157.55-91.54 0-166.01 70.68-166.01 157.55 0 2.21-1.79 4-4 4s-4-1.79-4-4c0-91.29 78.06-165.55 174.01-165.55s174.01 74.27 174.01 165.55c0 2.21-1.79 4-4 4zM511.71 721.84c-28.99 0-56.56-8.37-79.73-24.2-22.47-15.35-39.44-37.25-47.77-61.65-0.71-2.09 0.4-4.36 2.49-5.08 2.09-0.72 4.36 0.4 5.08 2.49 7.78 22.78 23.66 43.24 44.71 57.63 21.84 14.92 47.85 22.81 75.22 22.81 27.37 0 53.38-7.89 75.22-22.81 21.05-14.38 36.93-34.85 44.71-57.62a3.991 3.991 0 0 1 5.08-2.49c2.09 0.71 3.21 2.99 2.49 5.08-8.33 24.4-25.3 46.29-47.77 61.64-23.17 15.83-50.74 24.2-79.73 24.2z" fill="#333333" p-id="11463"></path><path d="M370.8 520.91m-52.43 0a52.43 52.43 0 1 0 104.86 0 52.43 52.43 0 1 0-104.86 0Z" fill="#333333" p-id="11464"></path><path d="M652.63 520.91m-52.43 0a52.43 52.43 0 1 0 104.86 0 52.43 52.43 0 1 0-104.86 0Z" fill="#333333" p-id="11465"></path></svg>
              <div>
                <p>阅读领奖</p>
                <p>本周已读2分钟</p>
              </div>
            </div>
        </div>
      </div>

      <!-- 名片 -->
      <div class="user" v-show="!login">
          <!-- 头像名字部分 -->
        <div class="Myname" @click="goLogin">
          <img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01e0ae58ae3d72a801219c77fadb52.png%401280w_1l_2o_100sh.png&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1644482444&t=fd89895cbc53318c3f38f38046345039" alt />
          <p>点我登录</p>
          <i class="iconfont icon-gt"></i>
        </div>
        <!-- 账户 -->
        <div class="money">
            <div class="money_one">
              <svg t="1640661623020" class="icon" viewBox="0 0 1025 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11604" width="200" height="200"><path d="M558.95 814.542c-9.551 7.974-23.847 6.723-31.87-2.787L200.83 425.009c-3.895-4.617-5.757-10.491-5.244-16.54 0.514-6.048 3.339-11.524 7.956-15.42l187.663-158.306c9.55-7.972 23.846-6.722 31.868 2.787l326.25 386.746c8.064 9.559 6.848 23.896-2.71 31.958L558.95 814.542z" fill="#FFD238" p-id="11605"></path><path d="M391.205 234.743L203.542 393.05c-4.617 3.895-7.443 9.371-7.956 15.419-0.513 6.048 1.349 11.922 5.244 16.54l0.105 0.124 192.04-160.316c8.023-6.698 19.957-5.623 26.655 2.401l325.675 390.12 1.307-1.104c9.559-8.062 10.775-22.399 2.711-31.958L423.073 237.53c-8.022-9.51-22.318-10.76-31.868-2.787" fill="#F0A600" p-id="11606"></path><path d="M386.399 228.985c12.708-10.609 31.732-8.945 42.407 3.71l326.25 386.745c10.73 12.72 9.112 31.798-3.608 42.527L563.866 820.208l-0.11 0.091c-12.708 10.61-31.732 8.946-42.407-3.709l-326.25-386.746c-10.73-12.719-9.112-31.798 3.608-42.527l187.582-158.24z m30.942 13.381c-5.367-6.36-14.948-7.194-21.33-1.865l-0.06 0.05-187.572 158.231c-6.381 5.384-7.198 15.01-1.815 21.39l326.25 386.747c5.367 6.361 14.948 7.193 21.33 1.865l0.06-0.05 187.572-158.232c6.38-5.383 7.198-15.008 1.815-21.39z m-39.13 51.37l6.48 5.906c8.874 8.087 22.595 8.412 32.627 0.775l7.568-5.763L696.944 617.16c4.326 5.128 6.395 11.65 5.825 18.363-0.57 6.713-3.708 12.793-8.835 17.12l-129.56 109.292a6.403 6.403 0 0 1-0.101 0.084c-10.613 8.861-26.457 7.486-35.381-3.094L256.832 436.42l6.957-6.49c9.218-8.6 11.209-22.18 4.733-32.29l-4.73-7.383 114.42-96.522z m0.19 26.004l-89.008 75.086c5.364 14.002 3.236 29.994-5.632 42.496L544.179 746.03c1.805 2.14 5.132 2.428 7.279 0.636l0.02-0.017 129.559-109.293c2.146-1.81 2.43-5.153 0.62-7.3L421.239 321.35c-13.818 6.635-29.94 6.037-42.837-1.609z" fill="#332D21" p-id="11607"></path><path d="M363.158 667.7c-11.164-5.491-15.825-19.063-10.392-30.255L573.74 182.27c2.638-5.434 7.25-9.52 12.985-11.508 5.736-1.986 11.887-1.627 17.322 1.01L824.912 279c11.163 5.49 15.825 19.062 10.392 30.255L614.33 764.427c-5.462 11.25-19.057 15.96-30.307 10.498L363.158 667.7z" fill="#FFD238" p-id="11608"></path><path d="M824.912 278.999L604.047 171.774c-5.435-2.638-11.586-2.997-17.322-1.01-5.735 1.987-10.347 6.073-12.985 11.507l-0.071 0.147 224.477 110.409c9.379 4.613 13.242 15.955 8.629 25.334L582.484 774.178l1.539 0.747c11.25 5.462 24.845 0.752 30.306-10.498l220.974-455.173c5.434-11.193 0.772-24.765-10.391-30.255" fill="#F0A600" p-id="11609"></path><path d="M566.993 178.997c7.268-14.97 25.359-21.238 40.329-13.97l220.77 107.18 0.13 0.061c14.855 7.307 21.058 25.367 13.828 40.261L621.076 767.702c-7.267 14.97-25.36 21.236-40.33 13.97l-220.77-107.179-0.128-0.063c-14.855-7.307-21.06-25.367-13.83-40.26z m33.778-0.476c-7.51-3.646-16.638-0.484-20.284 7.026L359.513 640.72c-3.635 7.487-0.505 16.581 6.955 20.25l0.07 0.034 220.76 107.173c7.51 3.646 16.638 0.485 20.284-7.026l220.974-455.173c3.635-7.487 0.505-16.58-6.955-20.25l-0.071-0.034z m30.29 47.18l134.664 65.375-2.767 8.32c-3.788 11.392 1.485 24.063 12.538 30.13l8.34 4.577-184.27 379.566c-2.93 6.035-8.05 10.574-14.417 12.78-6.366 2.204-13.196 1.804-19.23-1.125l-152.483-74.026-0.119-0.058c-12.406-6.102-17.582-21.139-11.537-33.59l184.27-379.567 8.754 3.721c11.603 4.933 24.821 1.238 31.43-8.783l4.827-7.32z m6.22 25.251c-10.619 10.585-26.098 15.134-41.124 12.106L419.772 626.384c-1.222 2.52-0.135 5.676 2.375 6.91l0.023 0.012 152.482 74.025c2.526 1.227 5.696 0.13 6.922-2.397L757.96 341.608c-11.674-9.934-17.674-24.909-15.922-39.8L637.28 250.951z m11.032 69.592c3.701 1.82 5.24 6.338 3.42 10.04l-41.929 85.246c-1.783 3.626-6.154 5.177-9.812 3.527l-0.228-0.107c-3.7-1.82-5.24-6.34-3.42-10.04l41.93-85.246c1.82-3.702 6.337-5.241 10.04-3.42z m24.823 34.497c3.701 1.82 5.24 6.338 3.42 10.04l-24.275 49.353c-1.783 3.626-6.155 5.176-9.812 3.527l-0.228-0.107c-3.702-1.82-5.24-6.339-3.42-10.04l24.274-49.354c1.821-3.7 6.34-5.24 10.041-3.419z" fill="#332D21" p-id="11610"></path><path d="M306.578 856.692c-69.52 0-126.078-56.56-126.078-126.079V570.578c0-69.52 56.558-126.078 126.078-126.078h378.87c69.52 0 126.078 56.558 126.078 126.078v160.035c0 69.52-56.558 126.078-126.078 126.078h-378.87z" fill="#EFEAE4" p-id="11611"></path><path d="M678.543 444.5h-23.069l53.175 34.964a111.556 111.556 0 0 1 50.265 93.211V755.53a56.909 56.909 0 0 1-32.51 51.414l-3.604 1.71a112.447 112.447 0 0 1-48.218 10.862H217.267c22.846 22.95 54.447 37.175 89.311 37.175h371.965c73.444 0 132.983-59.538 132.983-132.982V577.483c0-73.444-59.539-132.983-132.983-132.983" fill="#D8D3CE" p-id="11612"></path><path d="M817.234 713.843H572.542c-34.786 0-63.247-28.461-63.247-63.247s28.46-63.247 63.247-63.247h244.692c10.825 0 19.68 8.856 19.68 19.68v87.133c0 10.825-8.855 19.68-19.68 19.68" fill="#FFD238" p-id="11613"></path><path d="M572.542 721.343c-39.01 0-70.747-31.736-70.747-70.747 0-39.01 31.737-70.747 70.747-70.747h244.692c14.988 0 27.18 12.193 27.18 27.18v87.133c0 14.988-12.192 27.18-27.18 27.18H572.542z" fill="#FFD238" p-id="11614"></path><path d="M819.915 587.555v90.073c0 10.984-8.904 19.888-19.888 19.888H530.25c11.227 10.134 26.07 16.327 42.29 16.327h244.693c10.825 0 19.68-8.856 19.68-19.681V607.03c0-9.914-7.434-18.155-17-19.476" fill="#F0A600" p-id="11615"></path><path d="M685.448 437c35.55 0 69.057 13.931 94.353 39.226 25.041 25.042 38.945 58.134 39.221 93.286l0.004 1.066 0.001 1.816c18.11 0.927 32.596 15.812 32.883 34.082l0.005 0.555v87.13c0 18.523-14.595 33.7-32.888 34.636v1.816c0 35.549-13.932 69.058-39.226 94.353-25.043 25.042-58.134 38.945-93.287 39.22l-1.066 0.005h-378.87c-35.549 0-69.057-13.93-94.353-39.225-25.042-25.042-38.945-58.135-39.22-93.287l-0.005-1.066V570.578c0-35.549 13.93-69.057 39.225-94.352 25.043-25.042 58.135-38.946 93.287-39.222l1.066-0.004h378.87z m0 15h-378.87c-64.566 0-117.51 52.298-118.562 116.625l-0.016 1.953v160.035c0 64.566 52.298 117.51 116.625 118.562l1.953 0.016h378.87c64.566 0 117.51-52.298 118.562-116.625l0.016-1.953v-1.771H572.542c-42.714 0-77.544-34.402-78.237-76.954l-0.01-1.292c0-42.714 34.403-77.544 76.955-78.237l1.292-0.01 231.484-0.001v-1.77c0-64.566-52.298-117.51-116.625-118.562l-1.953-0.016z m118.578 135.348H572.542c-34.786 0-63.247 28.462-63.247 63.248 0 34.438 27.894 62.677 62.205 63.238l1.042 0.009 231.484-0.001V587.348z m15 0.082v126.331c9.88-0.903 17.71-9.187 17.886-19.252l0.003-0.347V607.03c0-10.222-7.896-18.688-17.888-19.6z m-212.963 25.85c20.609 0 37.316 16.708 37.316 37.316 0 20.609-16.707 37.316-37.316 37.316-20.61 0-37.315-16.707-37.315-37.316 0-20.608 16.706-37.315 37.315-37.315z" fill="#332D21" p-id="11616"></path></svg>
              <div>
                <p>账户</p>
                <p>请登录后查看</p>
              </div>
            </div>
            <div class="money_one">
              <svg t="1640661559376" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11460" width="200" height="200"><path d="M804.81 880.24H232.74c-45.55 0.63-65.28-46.18-60.69-82.51l525.94 14.21c77.78-2.71 77.78 4.37 72.14-54.59l-46.74-452.82c36.73 0 69.8 25.26 74.25 60.46l57.84 457.81c-10.3 33.92-29.42 48.38-50.67 57.44z" fill="#FFD524" p-id="11461"></path><path d="M792.97 884.87H230.46c-18.66 0-36.41-7.96-48.68-21.85-12.04-13.62-17.67-31.72-15.45-49.67l29.7-240.17a4.003 4.003 0 0 1 4.46-3.48c2.19 0.27 3.75 2.27 3.48 4.46l-29.7 240.17c-1.94 15.67 2.98 31.49 13.51 43.39 10.76 12.17 26.31 19.15 42.68 19.15h562.52c16.37 0 31.93-6.98 42.68-19.15 10.52-11.9 15.44-27.72 13.51-43.39l-55.5-448.86c-4.02-32.47-32.07-56.95-65.25-56.95h-433.4c-33.19 0-61.24 24.48-65.25 56.95a4.003 4.003 0 0 1-4.46 3.48 4.003 4.003 0 0 1-3.48-4.46c4.51-36.47 35.98-63.97 73.19-63.97H728.4c37.22 0 68.68 27.5 73.19 63.97l55.5 448.86c2.22 17.95-3.41 36.05-15.45 49.67-12.26 13.88-30.01 21.85-48.67 21.85z" fill="#333333" p-id="11462"></path><path d="M212.37 477.53a3.869 3.869 0 0 1-3.85-4.36l1.32-10.67c0.26-2.13 2.2-3.64 4.33-3.37 2.13 0.26 3.64 2.2 3.37 4.33l-1.32 10.67a3.89 3.89 0 0 1-3.85 3.4zM681.72 296.72c-2.21 0-4-1.79-4-4 0-86.88-74.47-157.55-166.01-157.55-91.54 0-166.01 70.68-166.01 157.55 0 2.21-1.79 4-4 4s-4-1.79-4-4c0-91.29 78.06-165.55 174.01-165.55s174.01 74.27 174.01 165.55c0 2.21-1.79 4-4 4zM511.71 721.84c-28.99 0-56.56-8.37-79.73-24.2-22.47-15.35-39.44-37.25-47.77-61.65-0.71-2.09 0.4-4.36 2.49-5.08 2.09-0.72 4.36 0.4 5.08 2.49 7.78 22.78 23.66 43.24 44.71 57.63 21.84 14.92 47.85 22.81 75.22 22.81 27.37 0 53.38-7.89 75.22-22.81 21.05-14.38 36.93-34.85 44.71-57.62a3.991 3.991 0 0 1 5.08-2.49c2.09 0.71 3.21 2.99 2.49 5.08-8.33 24.4-25.3 46.29-47.77 61.64-23.17 15.83-50.74 24.2-79.73 24.2z" fill="#333333" p-id="11463"></path><path d="M370.8 520.91m-52.43 0a52.43 52.43 0 1 0 104.86 0 52.43 52.43 0 1 0-104.86 0Z" fill="#333333" p-id="11464"></path><path d="M652.63 520.91m-52.43 0a52.43 52.43 0 1 0 104.86 0 52.43 52.43 0 1 0-104.86 0Z" fill="#333333" p-id="11465"></path></svg>
              <div>
                <p>阅读领奖</p>
                <p>请登录后查看</p>
              </div>
            </div>
        </div>
      </div>

    </div>

    <div class="title">
      <!-- 要钱的 -->
      <router-link tag="div" class="vip" :to="{name:'vip'}">
          <div>开通会员</div>
          <div class="right">
            <!-- <span>查看更多历史</span> -->
            <i class="iconfont icon-gt"></i>
          </div>
      </router-link>
    </div>
    <div class="title1">
      <!-- 历史记录等 -->
      <div class="hstory" @click="$router.push('history')">
          <div>历史记录</div>
          <div class="right">
            <span>查看更多历史</span>
            <i class="iconfont icon-gt"></i>
          </div>
      </div>
      <div class="hstory" @click="$router.push('download')">
          <div>离线下载</div>
          <div class="right">
            <i class="iconfont icon-gt"></i>
          </div>
      </div>
      <div class="hstory" @click="Sign()">
          <div >我的签到</div>
          <div class="right">
            <i class="iconfont icon-gt"></i>
          </div>
      </div>
      <div class="hstory" @click="setUp()">
          <div >我的设置</div>
          <div class="right">
            <i class="iconfont icon-gt"></i>
          </div>
      </div>
      <div class="hstory" @click="help()">
          <div>帮助与反馈</div>
          <div class="right">
            <i class="iconfont icon-gt"></i>
          </div>
      </div>
    </div>
  </div>
</template>

<script>
import { Toast } from 'vant';
import { Dialog } from 'vant';
export default {
  components: {
    [Dialog.Component.name]: Dialog.Component,
  },
  data() {
    return {
      login:null
    };
  },

  mounted() {},

  methods: {
    goLogin(){
      this.$router.push("/login")
    },
      //签到
    Sign(){
      Toast("该功能V3才开启")
    },
    //设置
    setUp(){
      Dialog.confirm({
          title: "你不就想退出登录嘛",
          message: "行吧",
        })
          .then(() => {
            sessionStorage.clear()
          this.$router.go(0)
          })
          .catch(() => {
            // on cancel
          });
    },
    //帮助
    help(){
      Toast("下次再帮你")
    },
    //个人中心
    people(){
      Toast("该功能待开发")
    },
  },
  created() {
    this.$emit("shownavson");
    this.login = this.$store.state.login
  },
};
</script>

<style lang="less">
#my {
  .background {
    position: relative;
    img {
      width: 100%;
    }
    //名片
    .user {
      position: absolute;
      top: 50px;
      width: 80%;
      margin: 0 10%;
      height: 130px;
      border-radius: 5px;
      box-shadow: 0px 0px  20px #e4e4e4;
      background-color: #fff;
      .Myname {
        display: flex;
        position: relative;
        height: 50%;
        align-items: center;
        border-bottom: #e2e2e2 1px solid;
        margin: 0 20px;
        justify-content: space-between;
        p {
          margin-left: 100px;
        }
        i{
            font-size: 20px;
            color: #000;
            font-weight: 600;
        }
        img {
          width: 4em;
          border-radius: 50%;
          position: absolute;
          top: -20%;
        }
      }
      .money{
        height: 50%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 20px;
        .money_one{
          display: flex;
          width: 50%;
          svg{
            width: 30px;
            height: auto;
          }
          p{
            padding-left: 6px;
          }
          p:nth-of-type(1){
            font-size: 14px;
          }
          p:nth-of-type(2){
            font-size: 12px;
            color: #999;
          }
        }
      }
    }
    
  }
  .title{
      padding:100px 20px 0px 20px;
      border-bottom: 8px solid #eeecec;
      .vip{
        display: flex;
        padding: 10px 0;
        justify-content: space-between;
        align-items: center;
        
        .right{
          display: flex;
          align-items: center;
          color: #999;
          span{
            font-size: 12px;
          }
          i{
            font-size: 20px;
          }
        }
      }
    }
  .title1{
      padding:0px 20px 0px 20px;
       border-bottom: 8px solid #eeecec;
      .hstory{
        display: flex;
        padding: 15px 0;
        justify-content: space-between;
        align-items: center;
        border-bottom:1px solid #e4e4e4 ;
        .right{
          display: flex;
          align-items: center;
          color: #999;
          span{
            font-size: 12px;
          }
          i{
            font-size: 20px;
          }
        }
      }
    }
}
</style>